<template>
  <div class="title-wrap">
    <span class="iconfont" :class="state"></span>
    <span class="title">{{title}}</span>
  </div>
</template>

<script>
  export default {
    name: 'DetailTitle',
    props: {
      title: String,
      state:String
    }
  }
</script>

<style lang="scss" scoped="scoped">
  @import '~styles/mixins.scss';
  @import '~styles/variables.scss';

  .title-wrap {
    @include flex-row;
    width: 100%;
    height: $headerHeight;
    line-height: $headerHeight;
    padding-left: .16rem;
    border-bottom: 1px solid #ddd;
    box-sizing: border-box;

    span {
      color: $defaultGreen;
      font-weight: bold;
      box-sizing: border-box;
    }

    .title {
      box-sizing: border-box;
      font-size: .16rem;
      margin-left: .1rem;
    }
  }
</style>
